<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ include file="/page/public/public-taglibs.jsp"%>
<!DOCTYPE html>
<html lang="en">
<head>
<%@ include file="/page/public/public-css.jsp"%>
</head>
<body class="no-skin">
	<div class="main-container" id="main-container">

		<!-- /section:basics/sidebar -->
		<div class="main-content">
			<div class="main-content-inner">
				<div class="page-content">
					<div class="row">
						<!-- /.page-header -->
						<div class="col-xs-12 col-sm-12 widget-container-col">
							<div class="widget-box widget-color-green">
								<!-- #section:custom/widget-box.options -->
								<div class="widget-header">
									<h5 class="widget-title">
										<i class="ace-icon fa fa-filter bigger-130"></i>查询内容
									</h5>
									<div class="widget-toolbar no-border"
										style="padding-top: 10px;">
										<a href="#" data-action="collapse" class="orange2"> <i
											class="1 ace-icon fa fa-chevron-up bigger-125 "></i>
										</a>
									</div>
									<div class="widget-toolbar no-border">
										<button type="button" class="btn btn-xs btn-yellow"
											onClick="doQuery();">
											<i class="ace-icon fa fa-search icon-on-left"></i>查询
										</button>

										<button type="button" class="btn btn-xs btn-light"
											onClick="doQueryReset();">
											<i class="ace-icon fa fa-refresh"></i> 重置
										</button>
									</div>
								</div>

								<!-- /section:custom/widget-box.options -->
								<div class="widget-body">
									<div class="widget-main">
										<div class="clearfix">
											<div class="row">
												<div class="col-xs-12">
													<!-- PAGE CONTENT BEGINS -->
													<form id='queryForm' class="form-horizontal" role="form">
														<div class="form-group col-sm-4">
															<label class="col-sm-3 control-label no-padding-right">表名</label>
															<div class="col-sm-9">
																<input type="text" name="table_name"
																	placeholder=""
																	class="col-xs-12 col-sm-12 input-sm" />
															</div>
														</div>
														
														<div class="form-group col-sm-4">
															<label class="col-sm-3 control-label no-padding-right">操作人</label>
															<div class="col-sm-9">
																<input type="text" name="account"
																	placeholder="用户名/邮箱/手机号"
																	class="col-xs-12 col-sm-12 input-sm" />
															</div>
														</div>
														
														<div class="form-group col-sm-4">
															<label class="col-sm-4 control-label no-padding-right">操作类型</label>
															<div class="col-sm-8">
											<fas:select list="$OPER_TYPE" name="log_type" cssClass="form-control input-sm"
																	emptyOption="true" headerKey="请选择" headerValue="" />
															</div>
														</div>

														<div class="form-group col-sm-6">
															<label class="col-sm-2 control-label no-padding-right">操作时间</label>
															<div class="col-sm-10">
																<div class="input-group">
																	<input type="text" placeholder="开始时间"
																		class="form_datetime input-sm form-control"
																		name="begin_opertime" /> <span
																		class="input-group-addon"> <i
																		class="fa fa-exchange"></i>
																	</span> <input type="text" placeholder="结束时间"
																		class="form_datetime input-sm form-control"
																		name="end_opertime" />
																</div>
															</div>
														</div>

													</form>
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
						<!-- /.span -->
					</div>
					<!-- /.row -->



					<div class="row">
						<!-- /.page-header -->
						<div class="col-xs-12 col-sm-12 widget-container-col">
							<div class="widget-box widget-color-green">
								<!-- #section:custom/widget-box.options -->
								<div class="widget-header">
									<h5 class="widget-title">
										<i class="ace-icon fa fa-table bigger-130"></i>数据列表
									</h5>

									<div class="widget-toolbar no-border"
										style="padding-top: 10px;">
										<a href="#" data-action="fullscreen" class="orange2"> <i
											class="ace-icon fa fa-expand bigger-125"></i>
										</a>
									</div>

									<div class="widget-toolbar no-border">
										<!-- 
										<button class="btn btn-xs btn-white btn-default ">
											<i class="ace-icon fa fa-plus bigger-120 blue"></i> 新增
										</button>

										<button class="btn btn-xs btn-white btn-default ">
											<i class="ace-icon fa fa-edit bigger-120 orange"></i> 修改
										</button>
										
										<button class="btn btn-xs btn-white btn-default ">
											<i class="ace-icon fa fa-file-text bigger-120 purple"></i> 查看
										</button>

										<button class="btn btn-xs  btn-white btn-default ">
											<i class="ace-icon fa fa-trash-o bigger-120 red2"></i> 删除
										</button>

										<button class="btn btn-xs btn-white btn-default ">
											<i class="ace-icon fa fa-refresh bigger-120 green"></i> 刷新
										</button>
										 -->

										<span style="padding-left: 20px;"> <i
											class="ace-icon fa fa-refresh bigger-120 "></i> 刷新
										</span>


									</div>
								</div>

								<!-- /section:custom/widget-box.options -->
								<div class="widget-body">
									<div class="widget-main"
										style="padding-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px;">
										<div class="clearfix">
											<div class="row">
												<div class="col-xs-12">
													<table id="dataTable" style="width: 100%"
														class="table table-striped table-bordered table-hover form-inline">
													</table>
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
						<!-- /.span -->
					</div>
					<!-- /.row -->


				</div>
			</div>
		</div>
	</div>





	<!-- 字典类别模态框（Modal） -->
	<div class="modal fade" id="modal-log-detail" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true" >
		<div class="modal-dialog modal-lg">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true"   style="font-size:30px">×</button>
					<h4 class="modal-title" id="myModalLabel">操作日志详细信息</h4>
				</div>
				<div class="modal-body">
							<div class="row">
								<div class="col-xs-12 table-scrollable" id="logDetailsDIV">
									
								</div>
							</div>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal-dialog -->
	</div>
	<!-- /.modal -->
	

<!-- JS模板 -->
	<script id="tmpl-log-detail" type="text/x-jquery-tmpl">

			<table class="table table-striped table-bordered table-hover" width="100%" id="dataTable">
			 	   <caption id="caption">
							<div class="col-sm-12">
						   		 	<span class="col-sm-2">操作人：{{= log.account}}</span>
									<span class="col-sm-2">操作类型：
											  {{if log.log_type == '1'}}
													新增
										      {{else log.log_type == '2'}}
            										修改
        									  {{else}}
            										删除
        									  {{/if}}
									</span>
									<span class="col-sm-4">操作表：{{= log.table_name}}（{{= log.table_comment}}）</span>
									<span class="col-sm-4">操作时间：{{= log.log_time}}</span>
							</div>
				   </caption>
				   
 			{{if log.log_type == '2'}}
					<thead>
				      <tr>
						 <th width="5%">序号</th>
				         <th width="10%">字段</th>
				         <th width="25%">名称</th>
				         <th width="30%">旧值</th>
				         <th width="30%">新值</th>
				      </tr>

				   </thead>
				   <tbody id="tbodyHtml">
						{{each(i,logitem) logItems }}
							{{if logitem.changed }}
						 		<tr>
				         			<td>{{= i+1}}</td>
									<td>{{= logitem.column_name}}</td>
				         			<td>{{= logitem.column_comment}}</td>
				         			<td>{{= logitem.old_value}}</td>
				         			<td style="background-color:red !important;color:#fff;">{{= logitem.new_value}}</td>
								</tr>
							{{else}}
								<tr>
									<td>{{= i+1}}</td>
									<td>{{= logitem.column_name}}</td>
				         			<td>{{= logitem.column_comment}}</td>
				         			<td>{{= logitem.old_value}}</td>
				         			<td>{{= logitem.new_value}}</td>
								</tr>
							{{/if}}
						{{/each}}
				   </tbody>
			{{else}}
					<thead>
				      <tr>
						 <th width="10%">序号</th>
				         <th width="10%">字段</th>
				         <th width="40%">名称</th>
				         <th width="40%">值</th>
				      </tr>
				   </thead>
				   <tbody id="tbodyHtml">
						{{each(i,logitem) logItems }}
						 <tr>
				         	<td>{{= i+1}}</td>
							<td>{{= logitem.column_name}}</td>
				         	<td>{{= logitem.column_comment}}</td>
				         	<td>{{= logitem.new_value}}</td>
 						 </tr>
						{{/each}}
				   </tbody>

  			{{/if}}
					
			 </table>

</script>

	<%@ include file="/page/public/public-js.jsp"%>
	<script type="text/javascript">
		$(function() {
			var initAction = function() {
				cmdList = ctx + "/system/operateLog/list";
			}

			var initDataTable = function() {
				dataTable = $('#dataTable')
						.dataTable(
								{
									//数据列控制（包括对应返回JSON属性名称，对应表头列索引位置、数据转换封装等）
									"aoColumnDefs" : [
											{
												"sTitle" : "日志编码", //列名
												"sName" : "log_id", //库表字段名
												"mData" : "log_id", //JSON返回属性
												"aTargets" : [ 0 ], //第几列
												"bVisible" : false, //px 或者 %
												"bSortable" : false
											//是否排序，默认排序
											},
											{
												"sTitle" : "公司ID",
												"sName" : "company_id",
												"mData" : "company_id",
												"aTargets" : [ 1 ],
												"bVisible" : false,
												"bSortable" : false
											},
											{
												"sTitle" : "表名",
												"sName" : "table_name",
												"mData" : "table_name",
												"aTargets" : [ 2 ],
												"bSortable" : true
											},
											{
												"sTitle" : "业务表名",
												"sName" : "table_comment",
												"mData" : "table_comment",
												"aTargets" : [ 3 ],
												"bSortable" : true
											},
											{
												"sTitle" : "操作人",
												"sName" : "account",
												"mData" : "account",
												"aTargets" : [ 4 ],
												"bSortable" : true
											},
											{
												"sTitle" : "操作类型",
												"sName" : "log_type",
												"mData" : "log_type",
												"aTargets" : [ 5 ],
												"bSortable" : true,
												"mRender" : function(value,
														type, row) {
													var html = ParamTool
															.getParamName(
																	"OPER_TYPE",
																	value);
													return html;
												}
											},
											{
												"sTitle" : "操作时间",
												"sName" : "log_time",
												"mData" : "log_time",
												"aTargets" : [ 6 ],
												"bSortable" : true
											},
											{
												"sTitle" : "业务主键值",
												"sName" : "primary_key",
												"mData" : "primary_key",
												"aTargets" : [ 7 ],
												"bSortable" : true
											},
											{
												"sTitle" : "操作",
												"sName" : "log_id",
												"mData" : "log_id",
												"aTargets" : [ 8 ],
												"bSortable" : false,
												"mRender" : function(value,
														type, row) {
													var html = "";
													html += '<a style="padding-left:15px" href="javaScript:void(0)" title="查看" onclick="Javascript:doViewDetailByPK(\''
															+ value
															+ '\',\''
															+ row.log_type
															+ '\');">&nbsp;查看详细</a>';
													return html;
												}
											} ],
									"aaSorting" : [ [ 6, "desc" ] ],//初始化加载，默认按第几列排序、排序方式（列从0开始计算）
									"sAjaxSource" : cmdList
								//数据源URL

								});
			}
			initAction();
			initDataTable();

			$('.form_datetime').datetimepicker({
				format : "YYYY-MM-DD HH:mm:ss",
				showTodayButton : true,
				showClear : true,
				showClose : true,
			});

		});
		
		
		function doViewDetailByPK(logid,type){
			var url = ctx + "/system/operateLog/loadLogDetailByPk";
			url = addParam(url,"logid",logid);
			url = addParam(url,"time",new Date().getTime());
			
			$("#logDetailsDIV").html("");
			$.ajax({
				  type: 'POST',
				  url: url,
				  dataType: "json",
				  success: function(response){
						if (response.status == RESULT_SUCCESS) {
							var  tmplId = "#tmpl-log-detail";
							var $logdetailItems = $(tmplId).tmpl(response.data);
							//console.log(response.data);
						  	$('#logDetailsDIV').html($logdetailItems);
						  	resizeMainIFrame();
						  	
							//弹出新增窗口
							$('#modal-log-detail').modal({
								keyboard : true
							});
						}else{
							handleAjaxError(response);
						}
				  }
			});
		}
	</script>
</body>
</html>